@import 'common.sass'

.profile-container
    width: vw(750)
    height: auto
    display: flex
    flex-direction: column
    justify-content: center
    align-items: center

    .title-box
        width: auto
        height: auto
        display: flex
        flex-direction: column
        align-items: center

        .english
            font-size: vw(18)
            color: $content_color

        .chinese
            font-size: vw(32)
            display: flex
            align-items: center
            color: $title_color

    .image-box
        width: vw(750)
        height: vw(250)
        display: flex
        flex-direction: column
        align-items: center
        background-color: red

    .content-box
        width: vw(700)
        height: auto
        display: flex
        flex-direction: column
        justify-content: center
        align-items: center
        text-indent: 2em
        color: $title_color
        font-size: vw(24)
        line-height: vw(48)

        .line
            width: vw(700)
            height: auto

.circle-container
    width: vw(750)
    height: vw(1000)
    display: flex
    flex-direction: column
    justify-content: center
    align-items: center

    .line
        width: vw(700)
        height: vw(250)
        display: flex
        justify-content: center
        align-items: center

        .element
            width: vw(350)
            height: vw(250)
            display: flex
            flex-direction: column
            justify-content: center
            align-items: center

            .image-box
                width: vw(100)
                height: vw(100)

                .img
                    width: vw(100)
                    height: vw(100)
                    border-radius: vw(100)
                    background-color: lightgray

                .one
                    background-image: url("images/group/1.png")
                    background-size: 100% 100%
                    background-position: center center

                .two
                    background-image: url("images/group/2.png")
                    background-size: 100% 100%
                    background-position: center center

                .three
                    background-image: url("images/group/3.png")
                    background-size: 100% 100%
                    background-position: center center

                .four
                    background-image: url("images/group/4.png")
                    background-size: 100% 100%
                    background-position: center center

                .five
                    background-image: url("images/group/5.png")
                    background-size: 100% 100%
                    background-position: center center

                .six
                    background-image: url("images/group/6.png")
                    background-size: 100% 100%
                    background-position: center center

                .seven
                    background-image: url("images/group/7.png")
                    background-size: 100% 100%
                    background-position: center center

                .eight
                    background-image: url("images/group/8.png")
                    background-size: 100% 100%
                    background-position: center center

            .title
                color: $title_color
                font-size: vw(28)

            .content-box
                color: $content_color
                font-size: vw(24)
